define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'editable'], function ($, undefined, Backend, Table, Form, undefined) {
    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'yexam/subject_combo/index' + location.search,
                    add_url: 'yexam/subject_combo/add'+location.search,
                    edit_url: 'yexam/subject_combo/edit',
                    del_url: 'yexam/subject_combo/del',
                    multi_url: 'yexam/subject_combo/multi',
                    table: 'yexam_subject',
                }
            });
            var table = $("#table");
            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                escape: false,
                pk: 'id',
                sortName: 'id',
                sortOrder:'asc',
                columns: [
                    [
                        {checkbox: true},
                        {field: 'sort', title: "排序",operate: false, editable: true},
                        {field: 'id', title: __('Id')},
                        {field: 'combo_bname', title: __('别名'),align: 'left',operate:'LIKE'},
                        {field: 'combo_name', title: __('套餐名称'),align: 'left',  operate: false},
                        {field: 'is_index', title: __('首页显示'),align: 'left',operate:'LIKE',formatter: Table.api.formatter.toggle},
                        {field: 'is_module', title: __('模块显示'),align: 'left',operate:'LIKE',formatter: Table.api.formatter.toggle},
                        {field: 'is_bottom', title: __('底部显示'),align: 'left',operate:'LIKE',formatter: Table.api.formatter.toggle},
                        {field: 'time', title: __('添加时间'),width: '300px',align: 'left', operate: false,formatter: Table.api.formatter.datetime},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate,}
                    ]
                ]
            });
            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        add: function () {
            let comboNum = 0; // 套餐的数量
            // 套餐修改
            $('#category').change(function () {
                let subject_id = $(this).find('option:selected').data('val');
                $.get("yexam/combo_list/getComboList?category_id="+$(this).val()+"&subject_id="+subject_id,(res) => {
                    let list = res.data;
                    let paperBag = res.paperBagList;
                    let html = '';
                    let paper = '';
                    for (const listElement of list) {
                        html += `<label for="combo${listElement.id}">
                                    <input type="checkbox" id="combo${listElement.id}" value="${listElement.combo_name}" name="row[combo][${listElement.id}][combo_name]">
                                    <span>${listElement.combo_name}</span>
                                </label>`;
                        comboNum++;
                        paper += `
                        <input type="hidden" name="row[combo][${listElement.id}][is_module]" value="${listElement.is_module}">
                        <input type="hidden" name="row[combo][${listElement.id}][combo_bname]" value="${listElement.combo_bname}">
                        <input type="hidden" name="row[combo][${listElement.id}][remark]" value="${listElement.remark}">
                        <div class="panel panel-info">
                            <div class="panel-heading combo-title">${listElement.combo_name}</div>
                            <div class="panel-body" style="padding: 5px;">
                                <div class="checkbox">
                                    <label for="link${listElement.id}unit">
                                        <input type="checkbox" name="row[combo][${listElement.id}][unit]" id="link${listElement.id}unit" value="1">章节练习
                                    </label>
                                    <label for="link${listElement.id}history">
                                        <input type="checkbox" name="row[combo][${listElement.id}][history]" id="link${listElement.id}history" value="1">历年真题
                                    </label>
                                </div>
                                <div>
                                    <div class="panel panel-success">
                                    <span class="pull-left-container"><small class="label pull-left label-warning">正式</small></span>
                                         <div class="panel-body" style="padding:12px;">
                                            <div class="checkbox">
                                                ${bag(paperBag,1,listElement.id)}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="panel panel-success">
                                    <span class="pull-left-container"><small class="label pull-left label-info">模拟</small></span>
                                        <div class="panel-body" style="padding:12px;">
                                            <div class="checkbox">
                                                ${bag(paperBag,2,listElement.id)}
                                            </div>
                                        </div>
                                    </div>
                                    <div class="panel panel-success" >
                                        <span class="pull-left-container"><small class="label pull-left label-success">付费</small></span>
                                        <div class="panel-body" style="padding:12px;">
                                            <div class="checkbox">
                                                ${bag(paperBag,3,listElement.id)}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        `;
                    }
                    function bag(lists,paperType,comboId)
                    {
                        let typeStr = ['normal','test','fee'];
                        let html = '';
                        for (const list of lists) {
                            if (list.type === paperType)
                            {
                                html += `<label for="link${list.id}${comboId}">
                                            <input type="checkbox" name="row[combo][${comboId}][${typeStr[paperType-1]}][]" id="link${list.id}${comboId}" value="${list.id}">${list.paper_name}
                                        </label>`;
                            }
                        }
                        return html;
                    }
                    $(".combo-list").html(html);
                    $('.paper-list').html(paper);
                });
            });
            //================= 套餐选中和取消
            $(document).on('change','.combo-list input[type=checkbox]',function () {
                let index = $('.combo-list input').index(this);
                console.log(index)
                let link = $('.paper-list .panel-info');
                if ($(this).prop('checked')) // 选中套餐
                {
                    link.eq(index).css('opacity',1);
                }
                else
                {
                    link.eq(index).css('opacity',0);
                }
            });
            Controller.api.bindevent();
        },
        edit: function () {
            Controller.api.bindevent();
        },
        api: {
            formatter:{
                is_pay: function (value, row, index) {
                    return value?'是':'否';
                },
            },
            bindevent: function () {
                $("#c-package_ids").data("params", function (obj) {
                    return {custom: {category_id: $("#c-category_id").val()}};
                });
                Form.api.bindevent($("form[role=form]"));
            }
        },
    };
    return Controller;
});
